<template>
	<view class="h_100 bg-white container">
		<u-sticky>
			<view class="container bg-white py-3">
				<view class="flex align-center" @click="hideKey()">
					<text class="c_6 font mr-1">查询:</text>
					<view class="time_input p-1 font_24" @click="timeShow = true">{{ timeValue || '请选择要查询的日期' }}</view>
					<!-- <u--input placeholder="请选择要查询的日期" border="surround" v-model="timeValue" @focus="hideKey(), (timeShow = true)" fontSize="23rpx"></u--input> -->
				</view>
				<u-datetime-picker
					:show="timeShow"
					v-model="time"
					mode="date"
					cancelText="重置"
					cancelColor="#CF1526"
					@close="timeShow = false"
					@confirm="timeConfirm"
					@cancel="(timeValue = ''), (timeShow = false), getInfo()"
					:closeOnClickOverlay="true"
				></u-datetime-picker>
			</view>
		</u-sticky>
		<view v-if="list.length <= 0" class="pt-5 m-auto"><u-empty mode="data" icon="http://cdn.uviewui.com/uview/empty/data.png" text="暂无记录"></u-empty></view>
		<view v-else class="w-100">
			<u-steps activeColor="#969799" direction="column" dot>
				<u-steps-item v-for="item of list" :key="item.id" :title="dataTime(item.add_time)">
					<view slot="desc">
						<view class="py-3" @click="toDetail(item)">
							<view class="company_box w-100 flex justify-between align-center" v-if="item.type == 2">
								<view class="flex">
									<image v-if="item.title_img" class="cont_img" :src="item.title_img" mode="aspectFit"></image>
									<view class="">
										<view class="cont_t font-weight-bold h4">{{ item.title }}</view>
										<view class="hot_num flex align-center font-sm">
											<view class="flex mr-2">
												<image src="/static/img2/nav1/hot_icon.png" mode=""></image>
												<text class="h6 font-weight-bold">{{ item.heat_val || 0 }}</text>
											</view>
											<text class="c_9 font_24 mr-1">产品数量：{{ item.company_count || 0 }}</text>
										</view>
									</view>
								</view>
							</view>
							<view class="flex align-center" v-else>
								<image v-if="item.title_img" class="title_img" :src="item.title_img" mode="aspectFill"></image>
								<view class="ml-2">
									<view class="h5 c_6 lh_42">{{ item.title || '' }}</view>
									<view class="flex align-center mt-1">
										<image v-if="item.user_img" class="user_img" :src="item.user_img" mode="aspectFit"></image>
										<text class="font_24 c_9 ml-1" @click.stop="goPages('/subPages/company_home/index?id=' + item.title_uid)">{{ item.user_name }}</text>
									</view>
								</view>
							</view>
						</view>
					</view>
				</u-steps-item>
			</u-steps>
			<u-loadmore :status="status" color="#E5E5E5" lineColor="#E5E5E5" dashed line />
		</view>
	</view>
</template>

<script>
import { getCompanyList } from '@/api/my/footprint.js';
import util from '@/common/js/util.js';
export default {
	data() {
		return {
			list: [],
			page: 1,
			status: 'loadmore',
			suo: true,
			timeValue: '',
			time: Number(new Date()), //时间查询
			timeShow: false
		};
	},
	computed: {
		dataTime(val) {
			return function(val) {
				return util.happenTimeFun(val);
			};
		}
	},
	onReachBottom() {
		if (this.suo) {
			//定义个小锁，当没有数据时锁住suo
			this.status = 'loading';
			this.page = ++this.page;
			setTimeout(() => {
				this.getInfo();
			}, 1000);
		}
	},
	onLoad() {
		this.getInfo();
		// 分享
		wx.showShareMenu({
			withShareTicket: true,
			menus: ['shareAppMessage', 'shareTimeline']
		});
	},
	methods: {
		getInfo() {
			let msg = {
				page: this.page,
				token: uni.getStorageSync('userInfo').token || '',
				time: this.timeValue
			};
			getCompanyList(msg)
				.then(res => {
					if (res.code == 0) {
						this.list.push(...res.data.data);
						if (res.data.data.length == 0) {
							this.status = 'nomore';
							this.suo = false;
						} else if (res.data.data.length < 10) {
							this.status = 'nomore';
							this.suo = false;
						} else {
							this.status = 'loadmore';
							this.suo = true;
						}
					} else {
						if (res.msg == '请先登录') {
							this.toLogin(); // 未登录
						} else {
							uni.$u.toast(res.msg);
						}
					}
					// console.log(res);
				})
				.catch(err => {
					console.log('获取我的足迹失败', err);
				})
				.finally(() => {
					this.timeShow = false;
				});
		},
		// 去详情
		toDetail(val) {
			// console.log(val);
			// type 1产品2企业3新闻4视频5资讯6项目
			// "type_code": 0, 当type=1 时，type_code：1代表图片产品，0：代表参数产品
			if (val.type == 1) {
				uni.navigateTo({
					url: '/subPages/home/product_data/detail?id=' + val.related_id + '&status=' + val.type_code
				});
			} else if (val.type == 2) {
				uni.navigateTo({
					url: '/subPages/company_home/index?id=' + val.related_id
				});
			} else if (val.type == 3) {
				uni.navigateTo({
					url: '/subPages/exhibition/news/detail?id=' + val.related_id
				});
			} else if (val.type == 5) {
				uni.navigateTo({
					url: '/subPages/company_home/info_detail?id=' + val.related_id
				});
			} else if (val.type == 6) {
				uni.navigateTo({
					url: '/subPages/company_home/case_detail?id=' + val.related_id
				});
			}
		},

		timeConfirm(e) {
			this.timeValue = util.happenTimeFun(e.value, 'ymd');
			this.list = [];
			this.getInfo();
		}
	}
};
</script>

<style lang="scss" scoped>
.time_input {
	width: 85%;
	color: #a3a3a3;
	border: 1px solid #dcdcdc;
}
.title_img {
	width: 200rpx;
	height: 120rpx;
	border: 1px solid #dcdcdc;
	display: block;
}
.user_img {
	width: 50rpx;
	height: 50rpx;
	box-shadow: 0px 0px 2px 0px #a3a3a3;
	border-radius: 50%;
}
.company_box {
	.cont_img {
		margin-right: 15rpx;
		width: 100rpx;
		height: 100rpx;
		border-radius: 10rpx;
		border: 1px solid #f2f2f2;
	}

	.hot_num {
		line-height: 42rpx;

		image {
			width: 21rpx;
			height: 26rpx;
			display: inline;
			margin-right: 5rpx;
			margin-top: 10rpx;
		}
	}
	.cont_head_r {
		image {
			width: 44rpx;
			height: 44rpx;
		}
		.star {
			margin-right: 15rpx;
		}
	}

	.cont_bottom_img {
		image {
			width: 215rpx;
			height: 128rpx;
			border-radius: 15rpx;
		}
	}
}
::v-deep .u-input {
	padding: 6rpx 12rpx !important;
}
</style>
